<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport"
	content="width=device-width, initial-scale=1, maximum-scale=1">
<title>OA-员工管理</title>
<link rel="stylesheet"
	href="${pageContext.request.contextPath}/resource/layui/css/layui.css">
<script type="text/javascript" src="./resource/js/jquery-2.0.3.js"></script>
</head>
<body class="layui-layout-body">
	<div class="layui-layout layui-layout-admin">
		<div class="layui-header">
			<div class="layui-logo">
				<img src="./resource/image/logo.png"
					style="width: 200px; height: 58px;">
			</div>
			<!-- 头部区域（可配合layui已有的水平导航） -->
			<ul class="layui-nav layui-layout-left">
				<iframe id="tianqi" allowtransparency="true" frameborder="0"
					width="410" height="60" scrolling="no"
					src="//tianqi.2345.com/plugin/widget/index.htm?s=2&z=3&t=1&v=2&d=2&bd=0&k=&f=ffffff&ltf=009944&htf=cc0000&q=0&e=1&a=1&c=59134&w=410&h=60&align=center"></iframe>
			</ul>
			<ul class="layui-nav layui-layout-right">
				<li class="layui-nav-item"><a href="javascript:;"> <img
						src="http://t.cn/RCzsdCq" class="layui-nav-img">
						${sessionScope.emp.empname}
				</a>
					<dl class="layui-nav-child">
						<dd>
							<a href="UserInfo.jsp">修改个人信息</a>
						</dd>
					</dl></li>
				<li class="layui-nav-item"><a href="login.jsp">退出</a></li>
			</ul>
		</div>
		<div class="layui-side layui-bg-black">
			<div class="layui-side-scroll">
				<!-- 左侧导航区域（可配合layui已有的垂直导航） -->
				<ul class="layui-nav layui-nav-tree" lay-shrink="all"
					lay-filter="test">
					<li class="layui-nav-item layui-nav-itemed"><a class=""
						href="javascript:;"><i class="layui-icon"> &#xe637; </i>考勤</a>
						<dl class="layui-nav-child">
							<dd>
								<a href="punch.jsp">打卡</a>
							</dd>
							<c:if test="${sessionScope.emp.position!='员工'}">
								<dd>
									<a href="Hrpattence.jsp">员工考勤查看</a>
								</dd>
							</c:if>
							<dd>
								<a href="MyselfPattence.jsp"class="layui-this">自我考勤查看</a>
							</dd>
						</dl></li>
					<li class="layui-nav-item"><a href="javascript:;"><i
							class="layui-icon">&#xe613; </i>请假管理</a>
						<dl class="layui-nav-child">
							<a href="leavetest.jsp"></i>请假申请</a>
							<c:if
								test="${sessionScope.emp.position!='员工'&&sessionScope.emp.position!='人事'}">
								<dd>
									<a href="LeaveList.jsp">请假审批</a>
								</dd>
							</c:if>
							<c:if test="${sessionScope.emp.position!='经理'}">
								<dd>
									<a href="LeaveMsg.jsp">请假信息查看</a>
								</dd>
							</c:if>
						</dl></li>
					<li class="layui-nav-item"><a href="javascript:;"><i
							class="layui-icon">&#xe716; </i>管理</a>
						<dl class="layui-nav-child">
							<c:if
								test="${sessionScope.emp.position!='员工'&&sessionScope.emp.position!='经理'}">
								<dd>
									<a href="GetEmps.jsp">员工管理</a>
								</dd>
							</c:if>
							<c:if test="${sessionScope.emp.position!='员工'}">
								<dd>
									<a href="GetDepts.jsp">部门管理</a>
								</dd>
							</c:if>
							<dd>
								<a href="UserInfo.jsp">个人信息管理</a>
							</dd>
						</dl></li>
					<li class="layui-nav-item"><a href="Note.jsp">公告</a></li>
				</ul>
			</div>
		</div>
		<div class="layui-body">
			<!-- 内容主体区域 -->
			<div class="layui-container">
				<div class="layui-row" style="padding-top: 50px;">
					<div class="layui-col-md1"></div>
					<!-- 员工表格展示 -->
					<div class="demoTable">
						搜索考勤日期：
						<div class="layui-inline">
							<input class="layui-input" name="datekeyword" id="demoReload"
								placeholder="如：2020-05-12" autocomplete="off">
						</div>
						<button class="layui-btn" data-type="reload">搜索</button>
						<!--<button class="layui-btn" data-type="add" id="AddEmp"
							data-method="offset" data-type="auto">添加员工</button>  -->

					</div>
				</div>
				<table class="layui-hide" id="LAY_table_user" lay-filter="user">
				</table>
				<!-- 表格结束 -->
				<!--<script type="text/html" id="toolbarDemo">
  					<div class="layui-btn-container">
   					<button class="layui-btn layui-btn-sm" lay-event="getCheckData">获取选中行数据</button>
  					<button class="layui-btn layui-btn-sm" lay-event="getCheckLength">获取选中数目</button>
   					<button class="layui-btn layui-btn-sm" lay-event="isAll">验证是否全选</button>
  					</div>
					</script> -->

				<script type="text/html" id="barDemo">
  					<button class="layui-btn layui-btn-xs update" lay-event="edit" id="update" >修改</button> 
					</script>
			</div>
		</div>
		<div class="layui-footer">
			<!-- 底部固定区域 -->
			© 中软 - JAVA二阶段项目 - 基于人脸识别的考勤系统 by TeamWork_XM
		</div>
	</div>

	<script
		src="${pageContext.request.contextPath}/resource/layui/layui.js"></script>

	<script>
		layui.use('element', function() {
			var element = layui.element;
		});
		layui.use([ 'form', 'table' ], function() {
			var form = layui.form, table = layui.table;
			//方法级渲染
			table.render({
				elem : '#LAY_table_user',
				url : 'AttendanceServlet?op=GetEmpIdByAttendanceType',
				limit : 10,
				toolbar : '#toolbarDemo', //开启头部工具栏，并为其绑定左侧模板
				defaultToolbar : [ 'filter', 'exports', 'print', { //自定义头部工具栏右侧图标。如无需自定义，去除该参数即可
					title : '提示',
					layEvent : 'LAYTABLE_TIPS',
					icon : 'layui-icon-tips',
				} ],
				cols : [ [ {
					checkbox : true,
					fixed : true
				}, {
					field : 'serialnum', //取json对象的key
					title : '流水号',//表头的名称
					sort : true, //筛选按钮
					fixed : true, //true保持对齐
					align : 'center'//内容居中
				}, {
					field : 'empid',
					title : '员工编号',
					align : 'center'
				}, {
					field : 'empname',
					//templet : '<div>{{d.dept.deptname}}</div>',
					title : '员工姓名',
					sort : true,
					align : 'center'
				}, {
					field : 'deptname',
					title : '部门名称',
					align : 'center'
				}, {
					field : 'position',
					title : '职位',
					sort : true,
					align : 'center'
				}, {
					field : 'attencetime',
					title : '考勤时间',
					sort : true,
					align : 'center'
				}, {
					field : 'attencetype',
					title : '考勤状态',
					sort : true,
					align : 'center'
				}, ] ],
				id : 'testReload',
				page : true,
				height : 600,
				width : 1200
			});
			//搜索按钮 不改
			var $ = layui.$, active = {
				reload : function() {
					var demoReload = $('#demoReload');

					//执行重载
					table.reload('testReload', {
						page : {
							curr : 1
						//重新从第 1 页开始
						},
						where : {
							key : demoReload.val()
						}
					}, 'data');
				}
			};
			//不改
			$('.demoTable .layui-btn').on('click', function() {
				var type = $(this).data('type');
				active[type] ? active[type].call(this) : '';
			});
			//头工具栏事件 先放着
			table.on('toolbar(user)', function(obj) {
				var checkStatus = table.checkStatus(obj.config.id);
				switch (obj.event) {
				case 'getCheckData':
					var data = checkStatus.data;
					layer.alert(JSON.stringify(data));
					break;
				case 'getCheckLength':
					var data = checkStatus.data;
					layer.msg('选中了：' + data.length + ' 个');
					break;
				case 'isAll':
					layer.msg(checkStatus.isAll ? '全选' : '未全选');
					break;

				//自定义头工具栏右侧图标 - 提示
				case 'LAYTABLE_TIPS':
					layer.alert('这是工具栏右侧自定义的一个图标按钮');
					break;
				}
				;
			});

			//监听行工具事件 
			table.on('tool(user)', function(obj) {
				var data = obj.data; //获取当前行数据成json格式
				console.log(obj);
				if (obj.event === 'del') { // del按钮
					layer.confirm('真的删除员工:' + data.empname + '么', function(
							index) {
						delemp(data.empid); //获取员工id
						layer.close(index); //关闭弹出层
					});
				} else if (obj.event === 'edit') { //编辑按钮
					getdata(obj); //获取当前数据
					layer.open({
						type : 1,
						formType : 2,
						content : $('#updatediv'),
						area : [ '718px', '645px' ],
					/* value : data.email */
					}, function(value, index) {
						obj.update({
							email : value
						});
						layer.close(index);
					});
				}
			});
		});
		//修改按钮的方法
	</script>

	<!-- 弹出层 -->
	<script type="text/javascript">
		layui.use('layer', function() { //独立版的layer无需执行这一句
			var $ = layui.jquery, layer = layui.layer; //独立版的layer无需执行这一句
			//触发事件
			var active = {
				offset : function(othis) {
					var type = othis.data('type'), text = othis.text();
					layer.open({
						title : '添加员工',
						type : 2,
						offset : type,
						//,id: 'layerDemo'+type //防止重复弹出
						anim : 5, //弹窗特效
						content : 'AddEmp.jsp', //ifame的页面
						maxmin : true,
						area : [ '774px', '658px' ],//设置弹出层大小
						//, shadeClose: true
						btn : '关闭',
						btnAlign : 'c', //按钮居中
						shade : 0.1, //不显示遮罩
						yes : function() {
							layer.closeAll();
							location.href = "GetEmps.jsp";
						}
					});
				}
			};
			//监听事件
			$('#AddEmp').on('click', function() {
				var othis = $(this), method = othis.data('method');
				active[method] ? active[method].call(this, othis) : '';
			});
			//修改

		});
		//获取到值，设置在弹出层上
		function getdata(obj) {//obj.data.serialnum
			$('#serialnum3').val(obj.data.serialnum);
			$('#empid3').val(obj.data.empid);
			$('#empname3').val(obj.data.empname);
			$('#deptname3').val(obj.data.deptname);
			$('#position3').val(obj.data.position);
			$('#attencetime3').val(obj.data.attencetime);
			$('#attencetype3').val(obj.data.attencetype);

		};
		//修改按钮点击事件操作
		function updataemp() {
			$.ajax({
				type : 'get',
				dataType : "json",
				url : "AttendanceServlet",//提交修改到servlet
				data : $("#updatatable").serialize(), //将表单内容序列化成一个字符串
				success : function(data) {
					if (data.msg == "修改成功") {
						layer.closeAll();
						location.href = "Hrpattence.jsp";
					}
				}
			});
		};
	</script>
	<div id="updatediv" style="display: none; width: 645px;">

		<form class="layui-form" action="" id="updatatable">

			<div class="layui-form-item">
				<label class="layui-form-label">流水号</label>
				<div class="layui-input-block">
					<input type="text" name="serialnum3" id="serialnum3" required
						lay-verify="required" readonly="true" class="layui-input">
				</div>
			</div>
			<div class="layui-form-item">
				<label class="layui-form-label">员工编号</label>
				<div class="layui-input-block">
					<input type="text" name="empid3" id="empid3" required
						lay-verify="required" class="layui-input" readonly="true">
				</div>
			</div>
			<div class="layui-form-item">
				<label class="layui-form-label">员工姓名</label>
				<div class="layui-input-block">
					<input type="text" name="empname3" id="empname3" required
						lay-verify="required" class="layui-input" readonly="true">
				</div>
			</div>
			<div class="layui-form-item">
				<label class="layui-form-label">部门名称</label>
				<div class="layui-input-block">
					<input type="text" name="deptname3" id="deptname3" required
						lay-verify="required" class="layui-input" readonly="true">
				</div>
			</div>
			<div class="layui-form-item">
				<label class="layui-form-label">职位</label>
				<div class="layui-input-block">
					<input type="text" name="position3" id="position3" required
						lay-verify="required" class="layui-input" readonly="true">
				</div>
			</div>
			<div class="layui-form-item">
				<label class="layui-form-label">考勤时间</label>
				<div class="layui-input-block">
					<input type="text" name="attencetime3" id="attencetime3" required
						lay-verify="required" class="layui-input" readonly="true">
				</div>
			</div>
			<div class="layui-form-item">
				<label class="layui-form-label">考勤状态</label>
				<div class="layui-input-block">
					<input type="text" name="attencetype3" id="attencetype3" required
						lay-verify="required" class="layui-input">
				</div>
			</div>

			<input type="text" value="UpdateAttendanceType" name="op"
				hidden="hidden">
			<div class="layui-form-item">
				<label class="layui-form-label"></label>
				<div class="layui-input-block">
					<button class="layui-btn" type="button" onclick="updataemp()"
						id="index_updataemp" style="left: 1000px;">修改</button>
					<button class="layui-btn" type="button" onclick="layer.closeAll()">取消</button>
				</div>
			</div>

		</form>
	</div>





</body>
</html>